.login-div {
    margin: 150px auto;
    width: 400px;
    margin-top: 250px;
}

body {
    /* background-color: #f0f0f0; */
    background: linear-gradient(200deg, #72afd3, #96fbc4);

}
.login-container{
    position: relative;
}


/* 接下来是猫头鹰的样式 */
.owl {
    width: 211px;
    height: 108px;
    /* 背景图片 */
    background: url("./owl-login.png") no-repeat;
    /* 绝对定位 */
    position: absolute;
    top: -100px;
    /* 水平居中 */
    left: 50%;
    transform: translateX(-50%);
}

.owl .hand {
    width: 34px;
    height: 34px;
    border-radius: 40px;
    background-color: #472d20;
    /* 绝对定位 */
    position: absolute;
    left: 12px;
    bottom: -8px;
    /* 沿Y轴缩放0.6倍（压扁） */
    transform: scaleY(0.6);
    /* 动画过渡 */
    transition: 0.3s ease-out;
}

.owl .hand.hand-r {
    left: 170px;
}

.owl.password .hand {
    transform: translateX(42px) translateY(-15px) scale(0.7);
}

.owl.password .hand.hand-r {
    transform: translateX(-42px) translateY(-15px) scale(0.7);
}

.owl .arms {
    position: absolute;
    top: 58px;
    width: 100%;
    height: 41px;
    overflow: hidden;
}

.owl .arms .arm {
    width: 40px;
    height: 65px;
    position: absolute;
    left: 20px;
    top: 40px;
    background: url("./owl-login-arm.png") no-repeat;
    transform: rotate(-20deg);
    transition: 0.3s ease-out;
}

.owl .arms .arm.arm-r {
    transform: rotate(20deg) scaleX(-1);
    left: 158px;
}

.owl.password .arms .arm {
    transform: translateY(-40px) translateX(40px);
}

.owl.password .arms .arm.arm-r {
    transform: translateY(-40px) translateX(-40px) scaleX(-1);
}
